{extend name="$_admin_base_layout" /}

{block name="plugins-css"}
<link href="__LIBS__/jquery-nestable/jquery.nestable.css" rel="stylesheet" type="text/css" />
{/block}

{block name="content"}
<div class="row">
    <div class="col-md-12">
        <div class="block">

            <div class="block-content tab-content">
                <div class="tab-pane active">
                    {notempty name="menus"}
                    <div class="row data-table-toolbar">
                        <div class="col-sm-12">
                            <form action="{$Request.url}" method="get">
                                <div class="toolbar-btn-action">
                                    <a title="新增" class="btn btn-primary" href="{:url('add', ['module' => $Request.param.group])}"><i class="fa fa-plus-circle"></i> 新增</a>
                                    <!--<button title="保存" type="button" class="btn btn-default disabled" id="save" disabled><i class="fa fa-check-circle-o"></i> 保存节点</button>-->
                                    <!--<button title="隐藏禁用节点" type="button" class="btn btn-danger" id="hide_disable"><i class="fa fa-eye-slash"></i> 隐藏禁用节点</button>
                                    <button title="显示禁用节点" type="button" class="btn btn-info" id="show_disable"><i class="fa fa-eye"></i> 显示禁用节点</button>-->
                                    <button title="展开所有节点" type="button" class="btn btn-success" id="expand-all"><i class="fa fa-plus"></i> 展开</button>
                                    <button title="收起所有节点" type="button" class="btn btn-warning" id="collapse-all"><i class="fa fa-minus"></i> 收起</button>
                                    <span class="form-inline">
                                        <input class="form-control" type="text" name="max" value="{$Request.get.max|default=''}" placeholder="显示层数">
                                    </span>
                                </div>
                            </form>
                        </div>
                    </div>

                    <div class="dd" id="menu_list">
                        <ol class="dd-list">{$menus|raw}</ol>
                    </div>
                    {/notempty}

                </div>
            </div>
        </div>
    </div>
</div>

{/block}

{block name="script"}
<script src="__LIBS__/jquery-ui/jquery-ui.min.js"></script>
<script src="__LIBS__/jquery-nestable/jquery.nestable.js"></script>

<script>
    $(document).ready(function(){
        // 模块拖拽
        // $( "#sortable" ).sortable({
        //     connectWith: ".connectedSortable"
        // }).disableSelection();

        // 保存节点
        // $('#save').click(function(){
        //     Dolphin.loading();
        //     $.post("{:url('save')}", {menus: $('#menu_list').nestable('serialize')}, function(data) {
        //         Dolphin.loading('hide');
        //         if (data.code) {
        //             $('#save').removeClass('btn-success').addClass('btn-default disabled');
        //             Dolphin.notify(data.msg, 'success');
        //         } else {
        //             Dolphin.notify(data.msg, 'danger');
        //         }
        //     });
        // });

        // 初始化节点拖拽
        // $('#menu_list').nestable({maxDepth:4}).on('change', function(){
        //     $('#save').removeAttr("disabled").removeClass('btn-default disabled').addClass('btn-success');
        // });
        //
        // // 隐藏禁用节点
        // $('#hide_disable').click(function(){
        //     $('.dd-disable').hide();
        // });
        //
        // // 显示禁用节点
        // $('#show_disable').click(function(){
        //     $('.dd-disable').show();
        // });

        // 展开所有节点
        $('#expand-all').click(function(){
            $('#menu_list').nestable('expandAll');
        });

        // 收起所有节点
        $('#collapse-all').click(function(){
            $('#menu_list').nestable('collapseAll');
        });

        // 禁用节点
        $('.dd3-content').delegate('.disable', 'click', function(){
            var self     = $(this);
            var ids      = self.data('ids');
            var ajax_url = '{:url("disable", ["table" => "admin_menu"])}';
            Dolphin.loading();
            $.post(ajax_url, {ids:ids}, function(data) {
                Dolphin.loading('hide');
                if (data.code) {
                    self.attr('data-original-title', '启用').removeClass('disable').addClass('enable')
                        .children().removeClass('fa-ban').addClass('fa-check-circle-o')
                        .closest('.dd-item')
                        .addClass('dd-disable');
                } else {
                    Dolphin.notify(data.msg, 'danger');
                }
            });
            return false;
        });

        // 启用节点
        $('.dd3-content').delegate('.enable', 'click', function(){
            var self     = $(this);
            var ids      = self.data('ids');
            var ajax_url = '{:url("enable", ["table" => "admin_menu"])}';
            Dolphin.loading();
            $.post(ajax_url, {ids:ids}, function(data) {
                Dolphin.loading('hide');
                if (data.code) {
                    self.attr('data-original-title', '禁用').removeClass('enable').addClass('disable')
                        .children().removeClass('fa-check-circle-o').addClass('fa-ban')
                        .closest('.dd-item')
                        .removeClass('dd-disable');
                } else {
                    Dolphin.notify(data.msg, 'danger');
                }
            });
            return false;
        });
    });
</script>
{/block}
